<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8" isELIgnored="false"%>
<%@ include file="/WEB-INF/views/shared/taglib.jsp"%>
<%
	request.setAttribute("title", "理赔");
%>
<%@ include file="/WEB-INF/views/shared/master/weContentHeader.jsp"%>
<style type="text/css">
	.title {
		z-index: 0 !important;
	}
	 .icon-float-left {
		float:left; 
		padding:0.3rem;
		width: 1.6rem
	}
	
	.title-nextto-icon{
		margin: 0; 
		padding:0.3rem; 
		font-size: 0.9rem;
	}
	.title-top{
		background-color:#ececec;
		height: 28px;	
	}
	.weui-cells{
		margin-top:0px;
	}	
	.weui-cells:before{
		border-top:0px;
	}
	.weui-cells:after{
		border-bottom:0px;
	}
	.weui-cell:before{
		border-top:0px;
	}
	.weui-cell{
		border-bottom:1px solid #d3d3d3;
	}
	
	.bottom-btn {
		margin-top:100px;
		background-color: #2196F3;
	}
	
	.btn-lab{
		border-bottom:0px;
	}
	.bottom-lab>div {
		margin-bottom: 15px;
	} 
</style>
<%@ include file="/WEB-INF/views/shared/master/weTitle.jsp"%>
<div class="goback" data-back-href="<c:url value='/wechat/claim/claimIndex/claimIndex'/>"></div>
<form id="applyfor" action="<c:url value='/wechat/claim/greenChannel/submitApplication'/>" method="post">
	<div class="weui-cells weui-cells_form">
				<div class="weui-cell title-top">
					<div class="weui-cell__hd">
						<img class="icon-float-left" src=<c:url value="/images/we/enterpriseInsurance/shield.png"/> >	
					</div>
					<div class="weui-cell__bd">
						<div class="weui-cells__title title-nextto-icon">理赔信息</div>
					</div>
				</div>
				<div class="weui-cell">
					<div class="weui-cell__hd">
						<label class="weui-label">姓名</label>
					</div>
					<div class="weui-cell__bd">
						<input class="weui-input" type="text" name="name" value='${customer.username}' readonly>
					</div>
				</div>
				<div class="weui-cell">
					<div class="weui-cell__hd">
						<label for="" class="weui-label">性别</label>
					</div>
					<div class="weui-cell__bd">
						 <c:choose>
            				<c:when test="${customer.sex == '1'}">
            					<input type="hidden" name="sex" value="${customer.sex}">
           						<input class="weui-input" type="text" value='男' readonly>
         					</c:when>

				            <c:when test="${customer.sex == '2'}">
				            	<input type="hidden" name="sex" value="${customer.sex}">
				      			<input class="weui-input" type="text" value='女' readonly>
				         	</c:when>
        				</c:choose>	
					</div>
	           </div>
	         	<div class="weui-cell">
					<div class="weui-cell__hd">
						<label for="" class="weui-label">已购买险种</label>
					</div>
					<div class="weui-cell__bd">
						<input class="weui-input selected-color" id="insurance-category" type="text" name="product" placeholder="点这里选择险种">
					</div>
				</div>
	           
	             <div class="weui-cell">
					<div class="weui-cell__bd">
						<textarea class="weui-textarea"   name="comments" placeholder="在此处输入需求描述" rows="3" id="comments" onBlur="checkComments()"></textarea>
						<div class="weui-textarea-counter">
							<span id="word">0</span>/200
						</div>
					</div>
				</div>
				
				<div class="weui-cell">
					<div class="weui-cell__hd">
						<label for="" class="weui-label">手机号</label>
					</div>
					<div class="weui-cell__bd">
						<input class="weui-input" type="number" name="phone" pattern="[0-9]*" readonly value="${customer.phone}">
					</div>
				</div>
				
				<div class="weui-cell btn-lab">
					<div class="weui-cell__bd">
	  					<button type="button" class="weui-btn bottom-btn" onclick="applyforClaim()">立即预约</button>
					</div>
				</div>
	  </div>
</form>
<%@ include file="/WEB-INF/views/shared/scripts/jquery.jsp"%>
<%@ include file="/WEB-INF/views/shared/scripts/jqweui.jsp"%>

<script>
$("#insurance-category").select({
    title: "选择险种",
    multi: true,
    min: 0,
    max: 2,
    items: [
      {
        title: "健康",
        value: 1,
        description: "额外的数据1"
      },
      {
        title: "意外",
        value: 2,
        description: "额外的数据2"
      },
      {
        title: "理财",
        value: 3,
        description: "额外的数据3"
      },
      {
        title: "养老",
        value: 4,
        description: "额外的数据4"
      },
      {
        title: "教育",
        value: 5,
        description: "额外的数据5"
      },
      {
        title: "身价",
        value: 6,
        description: "额外的数据6"
      },
      {
         title: "保障",
         value: 7,
         description: "额外的数据7"
      },
      {
          title: "资产增值保全",
          value: 8,
          description: "额外的数据8"
       },
    ],
    beforeClose: function(values, titles) {
      return true;
    },
    onChange: function(d) {
      console.log(this, d);
    },
    onClose: function (d) {
      console.log('close')
    }
  });
</script>



<script type="text/javascript">
	
	/* 提交 */
	
	function applyforClaim(){
		if(!checkInput()){
			return;
		}
		
		var formData = $("#applyfor").serialize();
		var action = $("#applyfor").attr("action");
		var result = $.getTextPost(action,formData);
		if(result=="true"){
			$.toast("申请成功");
			setTimeout(function(){
				window.location.href = $.getVirtualPath()+"/wechat/claim/greenChannel/myClaim";
			},500);
		}else{
			$.toast("申请失败","forbidden");
		}
	}
	
	/* 检查是否选择险种 */
	
	function checkInsurance(){
		var insurance = $("#insurance-category").val();
		if($.isNull(insurance)){
			$.toptip("请选择险种","error");
			return false;
		}
		return true;
	}
	

	/* 检查是否描述需求 */
	function checkComments(){
		var comments = $("#comments").val();
		if($.isNull(comments)){
			$.toptip("请填写您的需求","error");
			return false;
		}
		return true;
	}
	
	/* 检查输入 */
	function checkInput(){
		if(checkInsurance()&&checkComments()){
			return true;
		}
		return false;
	}
	
</script>
<%@ include file="/WEB-INF/views/shared/master/weContentFooter.jsp"%>